// 导入必要的库和工具
import { defineStore } from 'pinia'; // Pinia状态管理库
import { getLeftData } from '@/api/earlyWarning'; // API请求方法
import { onMounted, ref } from 'vue'; // Vue响应式API
import { pipelineInfo } from '@/constants/components/pipelineInfo'; // 管线信息常量
import { getConfigKey } from '@/api/system/config';
import { useDrawPipeLine } from '@/hooks/useDrawPipeLine';
import { mapBackendData, type moduleInfo } from '@/utils/mapBackendData';
import { adjustWebSocketUrl } from '@/utils/adjustWebSocketUrl';

// 管线类型映射配置(中文名称与后端字段的映射关系)
const PIPELINE_TYPE_MAPPING = {
  '高压管线': { countKey: 'highPressurePipelines' },
  '次高压管线': { countKey: 'subHighPressurePipelines' },
  '中压管线': { countKey: 'mediumPressurePipelines' },
  '低压管线': { countKey: 'lowerPressurePipelines' }
} as const; // as const确保类型推断为字面量类型

//定义一个映射管线参数结构
const PIPELINE_PARAMS = {
  '高压管线': '3, 7',
  '次高压管线': '4',
  '中压管线': '8',
  '低压管线': '12'
} as const;
// 定义Pinia store
export const usePipelineInfoStore = defineStore('pipelineInfo', () => {
  // 响应式管线数据(初始值为导入的常量)
  const pipelineInfoData = ref<moduleInfo[]>(pipelineInfo);
  //获取系统参数 管线请求地址
  const pipeUrl = ref<string>('');

  const { drawPipeline, removePipeline } = useDrawPipeLine();

  /**
   * 切换管线实体显示状态
   * @param item 管线信息对象
   */
  const togglePipeLineEntities = async (item: moduleInfo) => {
    if (item.id === 4) return; //低压管线禁止触发点击事件
    const PipeLineName = item.name;
    item.clickStatus = !item.clickStatus; // 切换点击状态
    if (item.clickStatus) {
      const params = {
        url: pipeUrl.value,
        layers: PIPELINE_PARAMS[PipeLineName],
        name: PipeLineName
      };
      await drawPipeline(params);
    } else {
      removePipeline(PipeLineName);
    }
  };

  /**
   * 获取管线数据
   */
  const fetchPipeLineData = async () => {
    try {
      const { msg } = await getConfigKey('pip_line');
      // pipeUrl.value = msg.replace(
      //   /http:\/\/[\d.]+(:\d+)?/, // 匹配 `http://IP:PORT` 或 `http://IP`
      //   'http://100.70.1.62' // 替换为新的 IP（不带端口）
      // );
      pipeUrl.value = adjustWebSocketUrl(msg, '100.70.1.62:80');
      console.log('pipeUrl.value', pipeUrl.value);
      const response = await getLeftData({ type: 'pipelineInfo' }); // 发起API请求
      // 更新管线数据(经过映射处理)
      pipelineInfoData.value = mapBackendData(pipelineInfo, response.data.pipelineInfo, PIPELINE_TYPE_MAPPING);
    } catch (error) {
      console.error('获取管线数据失败:', error);
      // 可以考虑添加错误处理或UI反馈状态
    }
  };
  //初始化地图展示的管线还有点击高亮的元素
  const initPipelineInfoModule = () => {
    pipelineInfoData.value.forEach((item) => {
      if (item.id === 4) return; //LOW_PRESSURE_PIPELINE_ID
      removePipeline(item.name);
      item.clickStatus = false;
    });
  };
  // 组件挂载时自动获取数据
  onMounted(fetchPipeLineData);

  // 暴露给外部使用的属性和方法
  return {
    pipelineInfoData, // 管线数据
    initPipelineInfoModule, //初始化地图展示的管线还有点击高亮的元素
    togglePipeLineEntities // 切换实体显示方法
  };
});
